import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class AnimatedDecoratedBoxRoute extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _AnimatedDecoratedBoxRouteState();
  }
}

class _AnimatedDecoratedBoxRouteState extends State<AnimatedDecoratedBoxRoute> {
  Color _decorationColor = Colors.pink;
  var _padding = EdgeInsets.all(10);
  var _positionLeft = 0.0;
  var _positionTop = 0.0;
  var _opacity = 1.0;
  var _align = Alignment.topLeft;
  var _width = 300.0;
  var _images = 'index2.jpg';
  var _size = 15.0;
  var _spece = 2.0;
  var _line = TextDecoration.underline;
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return Scaffold(
      appBar: AppBar(
        title: Text('组件过渡动画'),
      ),
      body: Center(
        child: Column(
          children: <Widget>[
            GestureDetector(
              child: AnimatedDecoratedBox(
                boxDecoration: BoxDecoration(color: _decorationColor,),
                widget: Text('AnimatedDecoratedBox', style: TextStyle(fontSize: 30),),
                curve: Curves.linear,
                duration: Duration(seconds: 2),
                reverseDuration: Duration(seconds: 2),
              ),
              onTap: () {
                setState(() {
                  _decorationColor = _decorationColor == Colors.pink?Colors.green:Colors.pink;
                });
              },
            ),
            GestureDetector(
              child: AnimatedPadding(
                child: Container(
                  width: 200,
                  height: 50,
                  color: Colors.green,
                ),
                duration: Duration(seconds: 1),
                padding: _padding,
              ),
              onTap: () {
                setState(() {
                  _padding = _padding == EdgeInsets.all(10)?EdgeInsets.all(30):EdgeInsets.all(10);
                });
              },
            ),
            GestureDetector(
              child: Container(
                width: 300,
                height: 100,
                color: Colors.pink,
                child: Stack(
                  children: <Widget>[
                    AnimatedPositioned(
                      duration: Duration(seconds: 1),
                      left: _positionLeft,
                      top: _positionTop,
                      child: FlutterLogo(
                        size: 30,
                      ),
                    ),
                  ],
                ),
              ),
              onTap: () {
                setState(() {
                  _positionLeft = _positionLeft == 0?270:0;
                  _positionTop = _positionTop == 0?70:0;
                });
              },
            ),
            GestureDetector(
              child: Container(
                width: 300,
                height: 150,
                decoration: BoxDecoration(
                  border:Border.all()
                ),
                child: AnimatedOpacity(
                  duration: Duration(seconds: 1),
                  opacity: _opacity,
                  child: Image.asset('index.jpg',fit: BoxFit.cover,),
                ),
              ),
              onTap: () {
                setState(() {
                  _opacity = _opacity == 0?1:0;
                });
              },
            ),
            GestureDetector(
              child: Container(
                width: 300,
                height: 100,
                color: Colors.green,
                child: AnimatedAlign(
                  alignment: _align,
                  duration: Duration(seconds: 1),
                  child: FlutterLogo(size: 30,),
                ),
              ),
              onTap: (){
                setState(() {
                  _align = _align == Alignment.topLeft?Alignment.bottomCenter:Alignment.topLeft;
                });
              },
            ),
            GestureDetector(
              child: AnimatedContainer(
                duration: Duration(seconds: 1),
                width: _width,
                height: 100,
                color: Colors.pink,
                child: Image.asset(_images,fit: BoxFit.cover,),
              ),
              onTap: () {
                setState(() {
                  _width = _width == 300?150:300;
                  _images = _images == 'index2.jpg'?'index.jpg':'index2.jpg';
                });
              },
            ),
            GestureDetector(
              child:Container(
                width: 300,
                height: 100,
                color: Colors.red,
                alignment: Alignment.center,
                child: AnimatedDefaultTextStyle(
                  duration: Duration(seconds: 1),
                  style: TextStyle(color: _decorationColor,fontSize: _size,letterSpacing: _spece,decoration: _line),
                  child: Text('Hello Word'),
                ),
              ),
              onTap: (){
                setState(() {
                  _decorationColor = _decorationColor == Colors.pink?Colors.green:Colors.pink;
                  _size = _size == 15.0?25:15;
                  _spece = _spece == 2.0?0.0:2.0;
                  _line = _line==null?TextDecoration.underline:null;
                });
              },
            )
          ],
        ),
      ),
    );
  }
}

class AnimatedDecoratedBox extends ImplicitlyAnimatedWidget {
  AnimatedDecoratedBox(
      {Key key,
      this.boxDecoration,
      this.widget,
      Curve curve,
      Duration duration,
      Duration reverseDuration})
      : super(key: key, curve: curve, duration: duration);
  final BoxDecoration boxDecoration;
  final Widget widget;

  @override
  ImplicitlyAnimatedWidgetState<ImplicitlyAnimatedWidget> createState() {
    // TODO: implement createState
    return _AnimatedDecoratedBoxState();
  }
}

class _AnimatedDecoratedBoxState
    extends ImplicitlyAnimatedWidgetState<AnimatedDecoratedBox> {
  DecorationTween _decorationTween;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    controller.addListener(() {
      setState(() {
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    print(_decorationTween.evaluate(animation));
    return DecoratedBox(
      decoration: _decorationTween.evaluate(animation),
      child: widget.widget,
    );
  }

  @override
  void forEachTween(visitor) {
    // TODO: implement forEachTween
    _decorationTween = visitor(_decorationTween, widget.boxDecoration,
        (value) => DecorationTween(begin: value));
  }
}
